<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>MyShop</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<!-- Bootstrap -->
	<link href="css/bootstrap.css" rel="stylesheet" media="screen">
	<link href="css/myshop.css" rel="stylesheet" media="screen">
</head>
<body>
	<!--top-->
	<div class="navbar navbar-fixed-top">
		<div class="navbar-inner">
			<div class="container">
				<a class="brand" href="#">MyShop</a>
				<p class="navbar-text  pull-left">JavaEE创造,机会给有准备的人</p>
				
				<form class="navbar-form pull-right">
					<input type="text" class="span2" name="loginName" placeholder="用户名">
					<input type="password" class="span2" name="password" placeholder="密码">
					<button type="submit" class="btn">Sign In</button>
				</form>
				
				<!--登录后用户信息-->
				
				<ul class="nav pull-right">
					<li class="dropdown">
						<a href="#" class="dropdown-toggle" data-toggle="dropdown">
							<i class="icon-user"></i>Jack
							<span class="caret"></span>
						</a>
						<ul class="dropdown-menu">
							<li><a href="#"><i class=" icon-list"></i>我的订单</a></li>
							<li class="divider"></li>
							<li><a href="#">个人信息</a></li>
							<li><a href="#">修改密码</a></li>
							<li class="divider"></li>
							<li><a href="#">注销</a></li>
						</ul>
					</li>
					<li class="dropdown">
						<a href="#" class="dropdown-toggle" data-toggle="dropdown">
							<i class=" icon-shopping-cart"></i>	Cart
							<span class="caret"></span>				
						</a>
						<ul class="dropdown-menu">
							<li><a href="#">查看购物车</a></li>
							<li><a href="#">清空</a></li>					
						</ul>
					</li>
					<li>
						<a class="" href="#"><i class=" icon-circle-arrow-right"></i>	注销</a>
					</li>
				</ul>
			</div>
		</div>
	</div>
	<!-- end of top-->
	<!--Searcher bar-->
	<div class="container">
		<div class="row">
			<div id="logo" class="span3">
				MyShop
			</div>
			<div class="span7">
				<form class="form-search">
				<input type="text" class="span5 search-query">
				<button type="submit" class="btn btn-min btn-warning">Search</button>
			</form>
			</div>
			<div class="span2"></div>
			
		</div>
	</div>
	<!--Category  List & AD-->
	<div class="container">
		<div class="row">
			<!--Category List-->
			<div class="span3">
				<div class="catogery_list">
					<ul class="nav nav-list">
						<li class="nav-header">手机</li>
						<li class="active"><a href="#">三星</a></li>
						<li><a href="#">联想</a></li>
						<li><a href="#">华为</a></li>
						<li><a href="#">iphone</a></li>
						<li class="nav-header">计算机</li>
						<li><a href="#">Link</a></li>
						<li><a href="#">Link</a></li>
						<li><a href="#">Link</a></li>
						<li><a href="#">Link</a></li>
						<li><a href="#">Link</a></li>
						<li><a href="#">Link</a></li>      				
					</ul>
				</div>
			</div>
			<!--AD-->
			<div class="span9">
				<div id="myCarousel" class="carousel slide">
					<ol class="carousel-indicators">
						<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
						<li data-target="#myCarousel" data-slide-to="1"></li>
						<li data-target="#myCarousel" data-slide-to="2"></li>
					</ol>
					<!-- Carousel items -->
					<div class="carousel-inner ad_box">
						<div class="active item">
							<img   src="ad_img/ad_1.jpg"/>
						</div>
						<div class="item">
							<img   src="ad_img/ad_2.jpg"/>
						</div>
						<div class="item">
							<img  src="ad_img/ad_3.jpg"/>
						</div>
					</div>
					<!-- Carousel nav -->
					<a class="carousel-control left" href="#myCarousel" data-slide="prev">&lsaquo;</a>
					<a class="carousel-control right" href="#myCarousel" data-slide="next">&rsaquo;</a>
				</div>
			</div>
		</div>
	</div>
		
	<!--Product List-->
	<div class="container">
		<div class="row">
			<div class="span12 catogeryTitle">全部商品</div>
			<div class="span3 ">
				<div class="product_box">
					<img src="product_img\iphone5.jpg" />
					<p class="product_name">苹果手机iPhone5(16GB)(白)</p>
					<p class="product_price">¥4799.00</p>
					<a class="btn"href="#">详情</a> <a class=" btn btn-warning"href="#">加入购物车</a>
				</div>
			</div>
			<div class="span3 ">
				<div class="product_box">
					<img src="product_img\iphone5.jpg" />
					<p class="product_name">苹果手机iPhone5(16GB)(白)</p>
					<p class="product_price">¥4799.00</p>
					<a class="btn"href="#">详情</a> <a class=" btn btn-warning"href="#">加入购物车</a>
				</div>
			</div>
			<div class="span3 ">
				<div class="product_box">
					<img src="product_img\iphone5.jpg" />
					<p class="product_name">苹果手机iPhone5(16GB)(白)</p>
					<p class="product_price">¥4799.00</p>
					<a class="btn"href="#">详情</a> <a class=" btn btn-warning"href="#">加入购物车</a>
				</div>
			</div>
			<div class="span3 ">
				<div class="product_box">
					<img src="product_img\iphone5.jpg" />
					<p class="product_name">苹果手机iPhone5(16GB)(白)</p>
					<p class="product_price">¥4799.00</p>
					<a class="btn"href="#">详情</a> <a class="btn btn-warning"href="#">加入购物车</a>
				</div>
			</div>
			<div class="span3 ">
				<div class="product_box">
					<img src="product_img\iphone5.jpg" />
					<p class="product_name">苹果手机iPhone5(16GB)(白)</p>
					<p class="product_price">¥4799.00</p>
					<a class="btn"href="#">详情</a> <a class=" btn btn-warning"href="#">加入购物车</a>
				</div>
			</div>
			<div class="span3 ">
				<div class="product_box">
					<img src="product_img\iphone5.jpg" />
					<p class="product_name">苹果手机iPhone5(16GB)(白)</p>
					<p class="product_price">¥4799.00</p>
					<a class="btn"href="#">详情</a> <a class=" btn btn-warning"href="#">加入购物车</a>
				</div>
			</div>
			<div class="span3 ">
				<div class="product_box">
					<img src="product_img\iphone5.jpg" />
					<p class="product_name">苹果手机iPhone5(16GB)(白)</p>
					<p class="product_price">¥4799.00</p>
					<a class="btn"href="#">详情</a> <a class=" btn btn-warning"href="#">加入购物车</a>
				</div>
			</div>
			<div class="span3 ">
				<div class="product_box">
					<img src="product_img\iphone5.jpg" />
					<p class="product_name">苹果手机iPhone5(16GB)(白)</p>
					<p class="product_price">¥4799.00</p>
					<a class="btn"href="#">详情</a> <a class=" btn btn-warning"href="#">加入购物车</a>
				</div>
			</div>
			<div class="span3 ">
				<div class="product_box">
					<img src="product_img\iphone5.jpg" />
					<p class="product_name">苹果手机iPhone5(16GB)(白)</p>
					<p class="product_price">¥4799.00</p>
					<a class="btn"href="#">详情</a> <a class=" btn btn-warning"href="#">加入购物车</a>
				</div>
			</div>
			<div class="span3 ">
				<div class="product_box">
					<img src="product_img\iphone5.jpg" />
					<p class="product_name">苹果手机iPhone5(16GB)(白)</p>
					<p class="product_price">¥4799.00</p>
					<a class="btn"href="#">详情</a> <a class=" btn btn-warning"href="#">加入购物车</a>
				</div>
			</div>
			<div class="span3 ">
				<div class="product_box">
					<img src="product_img\iphone5.jpg" />
					<p class="product_name">苹果手机iPhone5(16GB)(白)</p>
					<p class="product_price">¥4799.00</p>
					<a class="btn"href="#">详情</a> <a class=" btn btn-warning"href="#">加入购物车</a>
				</div>
			</div>
			<div class="span3 ">
				<div class="product_box">
					<img src="product_img\iphone5.jpg" />
					<p class="product_name">苹果手机iPhone5(16GB)(白)</p>
					<p class="product_price">¥4799.00</p>
					<a class="btn"href="#">详情</a> <a class=" btn btn-warning"href="#">加入购物车</a>
				</div>
			</div>
			<div class="span12">				
				<div class="pagination  pagination-centered">
					<ul>
						<li><a href="#">Prev</a></li>
						<li><a href="#">1</a></li>
						<li><a href="#">2</a></li>
						<li><a href="#">3</a></li>
						<li><a href="#">4</a></li>
						<li><a href="#">5</a></li>
						<li><a href="#">Next</a></li>
					</ul>
				</div>
			</div>
	</div>
	<!--Footer-->
	<footer class="footer">
		<div class="container">
			<p>Java应用开发示例 攀枝花学院 BONE 2013</p>
			<p><a href="http://www.mypzh.com">http://www.mypzh.com</a></p>
		</div>
	</footer>	


	<script src="js/jquery-1.9.1.js"></script>
	<script src="js/bootstrap.js"></script>
	<script type="text/javascript">
	$(document).ready(function($) {
		//console.dir('load ok');
	});
	</script>
</body>
</html>